<template>
  <div>
    <ul>
      <router-link to="/secondcontacts/secondall">ALL contacts</router-link
      >&nbsp;
      <router-link to="/secondcontacts/secondalice">Alice</router-link
      >&nbsp;
      <router-link to="/secondcontacts/secondbob">Bob</router-link
      >&nbsp;
    </ul>
    <button @click="fn">随机显示</button>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  //   name: "",
  components: {},
  props: {},
  data() {
    return {
      arr: [
        "/secondcontacts/secondall",
        "/secondcontacts/secondalice",
        "/secondcontacts/secondbob",
      ],
    };
  },
  computed: {},
  watch: {},
  created() {},
  methods: {
    fn() {
      this.$router.push(this.arr[Math.floor(Math.random() * 3)]);
    },
  },
};
</script>

<style lang="less" scoped>
div {
  .router-link-active {
    color: red;
  }
}
</style>
